<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="../include/admincontent.jsp" %>
<div id="Content" class="get-depts">
    <div id="searchbox">
        <table class="treeTable searchform">
            <thead>
            <tr>
                <td width="60">部门编码：</td>
                <td width="100">
                    <div><input type="text" name="code"/></div>
                </td>
                <td width="60">部门名称：</td>
                <td width="100">
                    <div><input type="text" name="name"/></div>
                </td>
                <td width="60">部门全称：</td>
                <td width="140">
                    <div><input type="text" name="fullname"/></div>
                </td>
                <%--<td width="30">
                    <button id="searchbtn" type="button" class="search"></button>
                </td>--%>
                <td>
                    <div class="toolbars">
                        <a id="searchbtn" >
                            <em class="ico16 search_16"></em>
                            <span class="menu_span" title="查询">查询</span>
                        </a>
                    </div>
                </td>
            </tr>
            </thead>
        </table>
    </div>

    <table class="layui-hide" id="table" lay-filter="depSelect"></table>

</div>
<script type="text/html" id="toolbarS">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">选择</a>
</script>
<script type="text/javascript">
    $(document).ready(function () {
    });
    layui.use('table', () => {
        let table = layui.table;
        table.render({
            id: 'table'
            , elem: '#table'
            , height: 'full-120'
            , url: '/SysAdmin/getDepartmentJson' //数据接口
            , title: '用户表'
            , page: true //开启分页
            , cols: [[ //表头
                {type: 'numbers', title: '序号',  width: '50', sort: true}
                , {field: 'code', title: '部门编码', width: '110', sort: true}
                , {field: 'name', title: '部门名称', width: '140'}
                , {field: 'fullname', title: '部门全称', width: '140'}
                , {fixed: 'right', width: '110', align: 'center', toolbar: '#toolbarS'}
            ]]
        });
        $("#searchbtn").on('click', () => {
            table.reload('table', {
                    where: {
                        code: $("input[name='code']").val(),
                        name: $("input[name='name']").val(),
                        fullname: $("input[name='fullname']").val(),
                    }, page: {
                        curr: 1
                    }
                }
            )
        });
        table.on('tool(depSelect)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            let data = obj.data //获得当前行数据
                , layEvent = obj.event; //获得 lay-event 对应的值
            if (layEvent === 'detail') {
                parent.$('#deptcode').val(data.code);
                parent.$('#deptname').val(data.fullname);
                let index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                parent.layer.close(index);
            }
        });
    });
</script>
</body>
</html>